<template>
	<view class="page">
		<view class="content">
			<view class="head flex">
				<u-avatar size="80" :src="item.img"></u-avatar>
				<view class="info">
					<view class="name">
						金金小张
					</view>
					<view class="id">
						ID:256879348
					</view>
				</view>
				<view class="icon flex">
					<u-icon name="photo" @click="$refs.popup.open()" color="#2979ff" size="28"></u-icon>
					
					<u-icon name="gear" color="#2979ff" size="28"></u-icon>
					
					<uni-icons type="contact" size="30"></uni-icons>
					
				</view>
			</view>
			<view class="data">
				 <view class="val between">
				 	<view>123</view>
					<view>123</view>
					<view>123</view>
				 </view>
				 <view class="txt between">
				 	<view>关注</view>
				 	<view>粉丝</view>
				 	<view>获赞</view>
				 </view>
			</view>
			<view class="card">
				<u-cell :border="false" title="我的作品" value="更多" isLink></u-cell>
			</view>
			<view class="card">
				<u-cell :border="false" title="我的收藏" value="更多" isLink></u-cell>
			</view>
		</view>
		<uni-popup ref="popup" type="left">
			<pop></pop>
		</uni-popup>
	</view>
</template>

<script>
	import pop from './core/pop.vue'
	export default{
	   components:{
		   pop
	   }	
	}
</script>

<style lang="scss" scoped>
	.page{
		background: #F4F4F7; 
		padding: 30rpx;
		height: 100vh;
		.content{
			.head{
				.info{
					padding-left: 20px;
					.name{
						font-size: 40rpx;
						font-family: PingFangSC-Medium-, PingFangSC-Medium;
						font-weight: normal;
						color: #232832;
						line-height: 46rpx;
					}
					.id{
						font-size: 24rpx;
						font-family: PingFangSC-Regular-, PingFangSC-Regular;
						font-weight: normal;
						color: #787B86;
						line-height: 28rpx;
					}
				}
				.icon{
					height: 100px;
					display: flex;
					justify-content: flex-end;
					flex:1;
					padding-left: 20px;
				}
			}
			.data{
				background: #FFFFFF;
				border-radius: 30rpx 30rpx 30rpx 30rpx;
				padding: 20rpx;
				text-align: center;
				
				.val{
					font-size: 40rpx;
					font-family: PingFangSC-Medium-, PingFangSC-Medium;
					font-weight: normal;
					color: #232832;
					line-height: 46rpx;
				}
				.txt{
					font-size: 24rpx;
					font-family: PingFangSC-Regular-, PingFangSC-Regular;
					font-weight: normal;
					color: #787B86;
					line-height: 28rpx;
					margin-top: 10px;
				}
			}
			.card{
				background: #FFFFFF;
				border-radius: 30rpx 30rpx 30rpx 30rpx;
				padding: 10rpx;
				margin-top: 20rpx;
			} 
			
		}
	}
</style>